<template>
    <div>
    	<div class='ump'>
            <div class='content-title'>应用特权</div>
            <div style='padding:20px;min-height: 500px'>
                <Row style='margin-top:10px;'>
                    <Col span="8" v-for='item in privilege' :key='item'>
                        <a class='manage clearfix' @click='toAddons(item)'>
                            <div class='manage-logo'>
                                <i class='iconfont' :class='item.icon'></i>
                            </div>
                            <div style='float: left;margin-left: 10px'>
                                <div class='manage-name text_overflow text_overflow_line_1'>{{item.name}}</div>
                                <div class='manage-desc'>{{item.remark}}</div>
                            </div>
                        </a> 
                    </Col>
                </Row>
            </div>   
        </div>
    </div>
</template>
<script>
    export default{
        data(){
            return {
                privilege: [],
            }
        },
        created(){
            this.$bus.emit('updateMainMenuActive',this.$route.fullPath);

            this.fetch('/home/app/config/privilege/list').then(res=>{
                if(res&&res.data.data){
                    this.privilege = res.data.data;
                }
            })
        },
        methods:{
            toAddons(item){
                this.$router.push({ name: 'privilege', params: { id:item.id }})
            }
           
        }
    }
</script>
<style scoped>
    .manage-logo {
        float: left;
        width: 40px;
        height: 40px;
        border-radius:50%;
		background:#F6C075;
		position: relative;
    }
    .manage-logo i{
        font-size:30px;
		color:#fff;
		display: block;
		position: absolute;
		left:50%;
		margin-left: -15px;
		top:50%;
		margin-top: -22px;
    }
</style>